<template>
    <div class="app-container">
      <div class="mapDiv" v-loading="mapLoading">
        <div v-if="layerSelectViable" class="liduJiBie">
          <el-select v-model="layerName" placeholder="请选择烈度图层" @change="chooseProvince" clearable value-key="geom">
            <el-option v-for="item in liduJiBieData" :key="item.geom" :label="item.intensity1" :value="item">
            </el-option>
          </el-select>
          <el-select v-if="layerTypeVisable" v-model="layerType" placeholder="请选择图层评估方式" @change="chooseProvince1" clearable value-key="geom">
            <el-option v-for="item in layerTypeListAll" :key="item.name" :label="item.name" :value="item">
            </el-option>
          </el-select>
        </div>
        <!--地图-->
        <DesaIndexMap v-if="completeRefreshData==true"
                     @getMap="getMap"
                     @closePingGu="closePingGu"
                     @outAndInterRing="outAndInterRing"
                      :shpLegendList="shpDataForm.shpLegendList"
                      :shpDataList="shpDataForm.shpDataList"
                      :taskDataList="allDataList"
                      :sampleDataList="allDataList2"
                      :drawGeom="drawGeom"
                      :option="option"
                      :layerTypeMap="layerTypeMap"
                      :samPoiHouDataList0="samPoiHouDataList0"
                      :samPoiHouDataList1="samPoiHouDataList1"
                      :instrumentIntensityList="instrumentIntensityList"
                      :fastSeismicInfluenceList="fastSeismicInfluenceList"
        ></DesaIndexMap>
        <!--工具条控件-->
        <ControlToolBar v-if="completeRefreshData==true"
                        :map="map" :pageType="pageType" :mapDrawType="mapDrawType"
                        :showFileUploadBool="showFileUploadBool" :clearSelectFeatureBool="clearSelectFeatureBool"
                        :outAndInterRingData="outAndInterRingData"
                        @getAllDrawGeom="getAllDrawGeom" @seismicInfluenceUpload="seismicInfluenceUpload"
                        @createTaskArea="createTaskArea" @createSamplePoint="createSamplePoint"
                        @openLayerSelect="openLayerSelect"
        ></ControlToolBar>
        <!--文件上传组件-->
        <FileUpload :showFileUploadBool="showFileUploadBool" :code="typeCode"
                    @closeUpload="closeUpload" @sureUploadFile="uploadFile"
        ></FileUpload>
        <!--灾区范围图层图例-->
        <div class="new-legendDiv">
          <div style="text-align: center;">
            <span style="font-size: 14px;font-weight: bold;color: rgb(16, 124, 229);">图例</span>
          </div>
          <div style="text-align: center;height: 20px;">
            <span style="font-size: 14px;font-weight: bold;color: rgb(16, 124, 229);">灾区范围烈度</span>
          </div>
          <template v-for="item in shpDataForm.shpLegendList">
            <div v-show="item.show">
              <div><div style="border-color:rgb(152,152,152);" :style="{'background-color': item.color}" class="new-legendDiv-polygon"></div></div>
              <span>{{ item.fullName }}</span>
            </div>
          </template>
          <div v-show="isCheckBox2" v-on:mouseenter="handleMouseEnter" v-on:mouseleave="handleMouseLeave" style="height:30px;line-height:30px;">
            <div style="position: relative;top: 0px;left: 0px;width: 30px;height: 30px;margin-right: 10px;display: inline-block;">
              <div style="position: relative;left: 0px;top: 0px;width: 25px;height: 25px;border-radius: 15px;border-color: rgb(152, 152, 152);background-color: rgb(222, 1, 2);font-size: 13px;padding-left: 4px;padding-top: 4px;">
              8.7</div>
            </div>
            <span style="position:relative;top:0px;">仪器地震烈度</span>
          </div>
          <div v-show="isCheckBox3">
            <div><div style="border-color:rgb(152,152,152);" :style="{'background-color': 'blue'}" class="new-legendDiv-point"></div></div>
            <span>调查数据拟定烈度</span>
          </div>
          <div v-show="isCheckBox4">
            <div><div style="border-color:rgb(152,152,152);" :style="{'background-color': 'red'}" class="new-legendDiv-point"></div></div>
            <span>抽样点烈度</span>
          </div>
        </div>
        <div class="new-legendDiv1" v-show="isCheckBoxBool2">
          <span style="font-size: 12px;">仪器烈度图例</span>
          <div><span style="float: right;">0-1</span><div style="border-color:rgb(246,249,254);" :style="{'background-color': 'rgb(246,249,254)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">1-2</span><div style="border-color:rgb(151,235,255);" :style="{'background-color': 'rgb(151,235,255)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">2-3</span><div style="border-color:rgb(184,209,254);" :style="{'background-color': 'rgb(184,209,254)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">3-4</span><div style="border-color:rgb(123,255,155);" :style="{'background-color': 'rgb(123,255,155)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">4-5</span><div style="border-color:rgb(236,249,13);" :style="{'background-color': 'rgb(236,249,13)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">5-6</span><div style="border-color:rgb(255,198,0);" :style="{'background-color': 'rgb(255,198,0)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">6-7</span><div style="border-color:rgb(255,134,0);" :style="{'background-color': 'rgb(255,134,0)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">7-8</span><div style="border-color:rgb(254,53,0);" :style="{'background-color': 'rgb(254,53,0)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">8-9</span><div style="border-color:rgb(222,1,2);" :style="{'background-color': 'rgb(222,1,2)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">9-10</span><div style="border-color:rgb(157,0,0);" :style="{'background-color': 'rgb(157,0,0)'}" class="new-legendDiv-point"></div></div>
          <div><span style="float: right;">10+</span><div style="border-color:rgb(104,0,0);" :style="{'background-color': 'rgb(104,0,0)'}" class="new-legendDiv-point"></div></div>
        </div>

        <div class="currentEventDiv">
            <p class="title">当前地震事件:
                <span v-if="currentEvent">{{ currentEvent.eventName }}</span>
                <span v-else>请在地震事件管理中设置当前地震事件</span>
            </p>
          <div class="new-checkBoxDiv">
            <p><el-checkbox v-model="isCheckBox1" label="快速影响场" size="large" @change="checkBoxEvent1" />
              <el-button @click="showFastSiVersionDialog" style="margin-left:10px;">选择版本</el-button>
            </p>
            <p><el-checkbox v-model="isCheckBox2" label="仪器烈度" size="large" @change="checkBoxEvent2" /></p>
            <!--<p><el-checkbox v-model="isCheckBox3" label="调查数据拟定烈度" size="large" @change="checkBoxEvent3" /></p> -->
            <p><el-checkbox v-model="isCheckBox4" label="抽样点烈度" size="large" @change="checkBoxEvent4" /></p>
          </div>
        </div>

        <!--快速生成地震影响场版本信息列表-->
        <el-dialog v-model="showFastSiVersionTableBool" title="快速影响场版本选择" width="900px" append-to-body @close="showFastSiVersionTableBool=false">
          <div style="padding:10px;">
            <el-table v-loading="tableLoading" :data="fastSiVersionList" stripe>
              <el-table-column label="单选" width="55px">
                <template #default="scope">
                  <el-radio :label="scope.row.fvId" v-model="selectRadio"
                            @click.native.stop.prevent="getCurrentRow(scope.row)">&nbsp;</el-radio>
                </template>
              </el-table-column>
              <el-table-column label="地震影响场图编号" align="center" prop="versionCode" width="200" />
              <el-table-column label="长轴方向" align="center" prop="angle" width="100" />
              <el-table-column label="生成人" align="center" prop="createUserName" width="100" />
              <el-table-column label="生成时间" align="center" prop="createTime" width="100" />
              <el-table-column label="中心点经度" align="center" prop="longitude" width="100" />
              <el-table-column label="中心点纬度" align="center" prop="latitude" width="100" />
              <el-table-column label="震级" align="center" prop="earthquakeLevel" width="100" />
            </el-table>
            <pagination v-show="total3 > 0" :total="total3" v-model:page="queryParams3.page" v-model:limit="queryParams3.rows"
                        @pagination="getFastSiVersionList" />
          </div>
          <template #footer>
            <div class="dialog-footer">
              <el-button type="primary" @click="submitVersionSelect">确 定</el-button>
            </div>
          </template>
        </el-dialog>
      </div>
    </div>
</template>
  
<script setup name="disasterArea">
//地图
import DesaIndexMap from '@/map/disasterArea/indexMap.vue';
import ControlToolBar from '@/map/disasterArea/controlToolBar/map.vue';
import FileUpload from '@/map/components/fileUpload/index.vue';
import { getDisasterSeismicInfluenceList,getSurTaskManageList } from '@/api/map/shpFile';
import useEventStore from "@/store/modules/event";
import { MoreFilled } from '@element-plus/icons-vue'
import { getDict } from "@/api/system/dict";
import { getAllTaskDataList,getAllSamPoiDataList,getAllList, getAllList1, getAllList2, getDetail, getDetail1, updateData, del, getTaskCreateInfo,saveData,getPointCreateInfo2,getDetail2,saveData2,updateData2,del2 } from "@/api/fieldWork/taskManage.js"
import { getFastSiVersionListByXsemId,getFastSeismicInfluenceListByFvId } from "@/api/fastDisasterAnalysis/fastSeismicInfluence/intensity";
import { getSamPoiHouDataByXsemIdAndType } from "@/api/disasterArea/disasterArea";
import { getInstrumentIntensityList } from '@/api/disasterManage/instrumentIntensity';
import { ref } from 'vue';

const { proxy } = getCurrentInstance();
const allDataList = ref([]);//全部任务列表
const allDataList2 = ref([]);//全部抽样点列表
const dataList = ref([]);
const dataList1 = ref([]);
const dataList2 = ref([]);
const ids = ref();
const loading = ref(false);
const loading2 = ref(false);
const single = ref(true);
const multiple = ref(true);
const isTaskList = ref(false);
const isSamplPointList = ref(false);
const open = ref(false);
const open1 = ref(false);
const open2 = ref(false);
const total = ref(0);
const total1 = ref(0);
const total2 = ref(0);
const total3 = ref(0);
const title = ref('新建任务')
const title2 = ref('新建抽样点')
const title3 = ref('快速影响场选择版本')
const openGroup = ref(false);
const groupName = ref(false);
const groupId = ref(false);
const activeName = ref('first');
const isView = ref(false);
const isView2 = ref(false);
const liduJiBieData = ref([])
const layerName = ref('')
const layerType = ref('')
const layerTypeVisable = ref(false)
const currentEvent = computed(() => useEventStore().currentEvent);
//多选数据
const isCheckBox1 = ref(false);//快速影响场
const isCheckBox2 = ref(false);//仪器烈度
const isCheckBox3 = ref(false);//调查数据拟定烈度
const isCheckBox4 = ref(false);//补充调查数据拟定烈度
const showFastSiVersionTableBool = ref(false);//是否显示快速生成影响场版本选择面板
const tableLoading = ref(false);
const fastSiVersionList = ref([]);

const data = reactive({
    queryParams: {
        page: 1,
        rows: 10,
    },
    queryParams1: {
        page: 1,
        rows: 10,
    },
    queryParams2: {
        page: 1,
        rows: 10,
    },
    queryParams3: {//快速影响场查询
      page: 1,
      rows: 10,
    },
    form: {},
    form2: {},
    formGroup: {},
    rules: {
        taskName: [{ required: true, message: "任务名称不能为空", trigger: "blur" }],
        evaluationSubareaName: [{ required: true, message: "评估子区名称不能为空", trigger: "blur" }],
        evaluationSubareaType: [{ required: true, message: "评估子区类别不能为空", trigger: "change" }],
        // groupName: [{ required: false, message: "承担小组不能为空", trigger: "change" }],
        evaluationSubareaRange: [{ required: true, message: "任务区域不能为空", trigger: "change" }],
    },
    rules2: {
      samplingPointName: [{ required: true, message: "抽样点名称不能为空", trigger: "blur" }],
      address: [{ required: true, message: "抽样点详细位置不能为空", trigger: "blur" }],
      longitude: [{ required: true, message: "经度不能为空", trigger: "change" }],
      latitude: [{ required: true, message: "纬度不能为空", trigger: "change" }],
    },
    shpDataForm:{//导入灾区范围空间数据
      shpDataList:[],//灾区范围空间数据
      dataFileIds:"",//shp文件ID,
      shpLegendList:[
        {fullName:"Ⅴ（5度）",name:"Ⅴ",value:"5",color:"rgba(255,220,220,0.7)",show:false},
        {fullName:"Ⅵ（6度）",name:"Ⅵ",value:"6",color:"rgba(255,190,190,0.7)",show:false},
        {fullName:"Ⅶ（7度）",name:"Ⅶ",value:"7",color:"rgba(255,127,127,0.7)",show:false},
        {fullName:"Ⅷ（8度）",name:"Ⅷ",value:"8",color:"rgba(200,40,40,0.7)",show:false},
        {fullName:"Ⅸ（9度）",name:"Ⅸ",value:"9",color:"rgba(168,0,0,0.7)",show:false},
        {fullName:"Ⅹ（10度）",name:"Ⅹ",value:"10",color:"rgba(140,0,0,0.7)",show:false},
        {fullName:"Ⅺ（11度）",name:"Ⅺ",value:"11",color:"rgba(105,0,0,0.7)",show:false},
        {fullName:"Ⅻ（12度）",name:"Ⅻ",value:"12",color:"rgba(80,0,0,0.7)",show:false},
      ],//灾区范围图例列表
    },
    taskDataForm:{//任务信息
      geom:"",//当前选择的任务空间数据
      xstmId:"",//当前选择的任务ID，ID为空则新建任务
    },
    sampleDataForm:{//抽样点信息
      id:"",//当前选择的抽样点ID，ID为空则新建抽样点
      longitude:"",//当前选择的抽样点经度
      latitude:"",//当前选择的抽样点纬度
      geom:"",//当前选择的抽样点空间数据
      xstmId:"",//当前选择的抽样点所在的任务ID
    },

})
const { queryParams, form, queryParams1, formGroup, rules, rules2, queryParams2,form2,shpDataForm,taskDataForm,sampleDataForm,queryParams3 } = toRefs(data)


function openPoint(){
    isView2.value = false;
    title2.value = '新建抽样点';
    getInfo2();
}
const isCheckBoxBool2 = ref(false)
function handleMouseEnter() {
  isCheckBoxBool2.value = true;
  console.log('鼠标悬停在div上');
  // 在这里执行鼠标悬停时的逻辑
}
function handleMouseLeave(val) {
  isCheckBoxBool2.value = false;
}
const drawGeom = ref('')
const layerTypeListAll = ref([])
function chooseProvince(value) {
  layerType.value = ''
  if(value == '') {
    layerTypeVisable.value = false
    layerName.value = ''
    drawGeom.value = ''
  }else{
    layerTypeVisable.value = true
    layerName.value = value.intensity1
    drawGeom.value = value
    debugger
    let taskData = []
    for(let i = 0;i < dataList.value.length;i++) {
      if(dataList.value[i].siId == drawGeom.value.siId) {
        taskData.push(dataList.value[i].geom)
      }
    }
    if(taskData.length == 0) {
      if(drawGeom.value.geom.indexOf('),(') != -1) {
        layerTypeListAll.value = [
          { name: '整图层'},
          { name: '4点分割'},
        ]
      }else{
        layerTypeListAll.value = [
          { name: '整图层'},
          { name: '2点分割',geom: ''},
        ]
      }
    }else{
      layerTypeListAll.value = [
        { name: '剩余图层',geom: taskData},
        { name: '2点分割',geom: taskData},
      ]
    }
  }
  layerTypeMap.value = { name: 'change'} 
}
const layerTypeMap = ref({})
function chooseProvince1(value) {
  debugger
  if(value == '') {
    layerType.value = ''
    layerTypeMap.value = {name: ''} 
  }else{
    layerType.value = value.name
    layerTypeMap.value = value
  }
}
function getInfo2() {
    getPointCreateInfo2({eventCode:currentEvent.value.eventCode}).then(res => {
        form2.value = {};//清空
        open2.value = true;
        proxy.resetForm("addRef2");
        form2.value.samplingPointCode = res.data;//编号
        //抽样点经纬度
        form2.value.longitude = sampleDataForm.value.longitude;
        form2.value.latitude = sampleDataForm.value.latitude;
        form2.value.geom = sampleDataForm.value.geom;
        form2.value.xstmId = sampleDataForm.value.xstmId;//任务id
        form2.value.xsemId = currentEvent.value.id;//地震事件id
        console.log("新建抽样点form2");
        console.log(form2);
    })
}

// 编辑任务
function handleEdit2(id) {
    isView2.value = false;
    title2.value = "修改抽样点";
    detail2(id);
}

// 查看任务
function handleDetail2(id) {
    isView2.value = true;
    title2.value = "查看抽样点";
    detail2(id);
}


// 查看任务
function detail2(id) {
    getDetail2({ id: id }).then(res => {
        open2.value = true;
        proxy.resetForm("addRef2");
        form2.value = res.data;
        if (title.value == '修改抽样点') {
          if(res.data.id==sampleDataForm.value.id){
            //抽样点经纬度
            form2.value.longitude = sampleDataForm.value.longitude;
            form2.value.latitude = sampleDataForm.value.latitude;
            form2.value.geom = sampleDataForm.value.geom;
          }
          console.log("修改抽样点form2");
          console.log(form2);
        }
    })
}

// 保存抽样点
function save2() {
    proxy.$refs["addRef2"].validate(valid => {
        if (valid) {
            let lon = form2.value.longitude;
            let lat = form2.value.latitude;
            form2.value.geom = "POINT("+ lon + " " + lat + ")";//空间数据
            if (title2.value == '新建抽样点') {
                saveData2({ ...form2.value }).then(res => {
                    proxy.$modal.msgSuccess("新建成功");
                    open2.value = false;
                    getList2();
                    getAllDataList2();//获取全部抽样点列表
                })

              clearSelectFeatureBool.value = true;//是否删除选中要素
            } else if (title2.value == '修改抽样点') {
                updateData2({ ...form2.value }).then(res => {
                    proxy.$modal.msgSuccess("保存成功");
                    open2.value = false;
                    getList2();
                    getAllDataList2();//获取全部抽样点列表
                })
            }
            console.log("save2");
            console.log(form2.value);
        }
    })
}



function openTask() {
    isView.value = false;
    title.value = '新建任务';
    getInfo();
}

function getInfo() {
    getTaskCreateInfo({eventCode:currentEvent.value.eventCode}).then(res => {
        open.value = true;
        proxy.resetForm("addRef");
        form.value = res.data;
        //任务范围
        form.value.evaluationSubareaRange = taskDataForm.value.geom;
        form.value.geom = taskDataForm.value.geom;//空间数据
        console.log("新建任务form");
        console.log(form);
    })
}

function selectGroup() {
    if (!isView.value) {
        queryParams1.value = {
            page: 1,
            rows: 10,
        };
        getList1();
    }
}

// 修改任务
function handleEdit(xstmId) {
    isView.value = false;
    title.value = "修改任务";
    detail(xstmId);
}

// 查看任务
function handleDetail(xstmId) {
    isView.value = true;
    title.value = "查看任务";
    detail(xstmId);
}

// 查看任务
function detail(id) {
    getDetail({ id: id }).then(res => {
        open.value = true;
        proxy.resetForm("addRef");
        form.value = res.data;
        if (title.value == '修改任务') {
          if(res.data.xstmId==taskDataForm.value.xstmId){
            //任务范围
            form.value.evaluationSubareaRange = taskDataForm.value.geom;
            form.value.geom = taskDataForm.value.geom;//空间数据
          }
          console.log("修改任务form");
          console.log(form);
        }
    })
}

/** 多选框选中数据 */
function handleSelectionChange(selection) {
    multiple.value = !selection.length;
    groupId.value = selection.map((item) => item.xitId);
    groupName.value = selection.map((item) => item.teamName);
};

function queryGroup() {
    form.value.groupName = groupName.value.join(',');
    form.value.groupId = groupId.value.join(',');
    open1.value = false;
}

/** 删除按钮操作 */
function handleDelete(xstmId) {
    proxy.$modal
        .confirm("请确认是否要删除该任务？",)
        .then(function () {
            return del(xstmId);
        })
        .then(() => {
            getList();
            getAllDataList();//获取全部任务列表
            proxy.$modal.msgSuccess("删除成功");
        })
        .catch(() => { });
}

/** 删除按钮操作 */
function handleDelete2(id) {
  proxy.$modal
      .confirm("请确认是否要删除选中该抽样点？",)
      .then(function () {
        return del2(id);
      })
      .then(() => {
        getList2();
        getAllDataList2();//获取全部抽样点列表
        proxy.$modal.msgSuccess("删除成功");
      })
      .catch(() => { });
}

/** 查询数据列表--获取任务列表（分页） */
function getList() {
    if (currentEvent.value) {
        loading.value = true;
        //0:新建的评估子区   1:重新划定的评估子区
        getAllList({ ...queryParams.value, xsemId: currentEvent.value.id },"").then(response => {
            dataList.value = response.data.rows ? response.data.rows : [];
            total.value = response.data.total;
            loading.value = false;
            console.log("获取任务列表");
            console.log(dataList.value);
        });
    } else {
        dataList.value = [];
        total.value = 0;
    }
}

/** 查询数据列表--获取全部任务列表 */
function getAllDataList() {
  if (currentEvent.value) {
    loading.value = true;
    //0:新建的评估子区   1:重新划定的评估子区
    getAllTaskDataList({ ...queryParams.value, xsemId: currentEvent.value.id },"").then(response => {
      allDataList.value = response.data;
      loading.value = false;
      console.log("获取全部任务列表");
      console.log(allDataList.value);
    });
  } else {
    allDataList.value = [];
  }
}

/** 查询数据列表--获取小组列表 */
function getList1() {
    if (currentEvent.value) {
        getAllList1({ ...queryParams1.value, xsemId: currentEvent.value.id }).then(response => {
            dataList1.value = response.data.rows ? response.data.rows : [];
            total1.value = response.data.total;
            console.log(response.data);
            open1.value = true;
        });
    } else {
        dataList1.value = [];
        total1.value = 0;
    }
}

/** 查询数据列表--获取抽样点列表（分页） */
function getList2() {
    if (currentEvent.value) {
        loading2.value = true;
        getAllList2({ ...queryParams2.value, xsemId: currentEvent.value.id }).then(response => {
            dataList2.value = response.data.rows ? response.data.rows : [];
            total2.value = response.data.total;
            loading2.value = false;
            console.log("获取抽样点列表");
            console.log(dataList2.value);
        });
    } else {
        dataList2.value = [];
        total2.value = 0;
    }
}

/** 查询数据列表--获取全部抽样点列表 */
function getAllDataList2() {
  if (currentEvent.value) {
    loading2.value = true;
    getAllSamPoiDataList({ ...queryParams2.value, xsemId: currentEvent.value.id }).then(response => {
      allDataList2.value = response.data;
      loading2.value = false;
      console.log("获取全部抽样点列表");
      console.log(allDataList2.value);
    });
  } else {
    allDataList2.value = [];
  }
}

// 查看调查组
function detail1(id) {
    getDetail1({ id: id }).then(res => {
        openGroup.value = true;
        proxy.resetForm("groupRef");
        activeName.value = 'first'
        formGroup.value = res.data;
    })
}

/*地图传参start*/
const pageType = ref("灾区范围页面");
const mapLoading = ref(false);
const completeRefreshData = ref(false);//防止刷新后地图不显示
//地图对象
const map = ref(null);
const getMap = (obj)=>{
  map.value = obj;
}
const outAndInterRingData = ref([])
const outAndInterRing = (list) => {
  outAndInterRingData.value = list
}
const closePingGu = () => {
  layerType.value = ''
  layerTypeMap.value = {name: ''} 
}
const mapDrawType = ref("");//是否开启地图圈选查询类型（StopDraw关闭地图圈选 Polygon多边形绘制 Circle圆形绘制 Clear清空）
const polygonDrawBool = ref(false);
//全部地图绘制空间数据
const allDrawGeomText = ref("");
//获取全部地图绘制结果
const getAllDrawGeom = (list) =>{
  let geom = "";
  if(list && list.length>0){
    geom = "MULTIPOLYGON(";
    for(let i=0;i<list.length;i++){
      if(i>0){
        geom += ",";
      }
      geom += list[i].split("POLYGON")[1];
    }
    geom += ")";
  }
  console.log("获取全部地图绘制结果");
  console.log(geom);
  if(geom=="MULTIPOLYGON()"){
    geom = "";
  }
  allDrawGeomText.value = geom;//全部地图绘制空间数据
}
const showFileUploadBool = ref(false);//是否显示上传文件组件
//导入地震影响场
const seismicInfluenceUpload = (val)=>{
  showFileUploadBool.value = val;
}
const layerSelectViable = ref(false)
//开启烈度选择框
const openLayerSelect = (val) => {
  layerSelectViable.value = val
}
//关闭上传文件窗口
const closeUpload = ()=>{
  showFileUploadBool.value = false;
}
// 确认上传数据文件
function uploadFile(value) {
  proxy.$modal.msgSuccess("导入成功");
  //数据列表
  if (value.dataList) {
    shpDataForm.value.shpDataList = value.dataList;
  } else {
    shpDataForm.value.shpDataList = [];
  }
  //文件列表
  if (value.fileList) {
    let arr = [];
    value.fileList.forEach(item => {
      arr.push(item.attachId)
    })
    shpDataForm.value.dataFileIds = arr.join(',');
  } else {
    shpDataForm.value.dataFileIds = '';
  }
}
const clearSelectFeatureBool = ref(false);//是否删除选中要素
//新建任务|修改任务
const createTaskArea = (obj)=>{
  clearSelectFeatureBool.value = false;//是否删除选中要素
  let xstmId = obj.xstmId;
  taskDataForm.value.xstmId = xstmId;
  if(obj.type=="保存"){
    if(obj.geom){
      taskDataForm.value.geom = obj.geom;
      //根据事件ID、空间数据查询灾区范围列表
      getSeismicInfluenceArray(obj.geom);
    }else{
      taskDataForm.value.geom = "";
    }
  }else if(obj.type=="查看"){
    if(xstmId){
      // 查看任务
      handleDetail(xstmId);
    }
  }else if(obj.type=="删除"){
    if(xstmId){
      // 删除任务
      handleDelete(xstmId);
    }
  }
}
//新建抽样点
const createSamplePoint = (obj)=>{
  clearSelectFeatureBool.value = false;//是否删除选中要素
  let id = obj.id;
  sampleDataForm.value.id = id;
  if(obj.type=="保存"){
    if(obj.lon && obj.lat){
      sampleDataForm.value.longitude = obj.lon;
      sampleDataForm.value.latitude = obj.lat;
      let geom = "POINT("+ obj.lon + " " + obj.lat + ")";//空间数据
      sampleDataForm.value.geom = geom;
      //根据事件ID、空间数据查询任务列表
      getSurTaskManageArray(geom);
    }else{
      sampleDataForm.value.longitude = "";
      sampleDataForm.value.latitude = "";
      sampleDataForm.value.geom = "";
    }
  }else if(obj.type=="查看"){
    if(id){
      // 查看抽样点
      handleDetail2(id);
    }
  }else if(obj.type=="删除"){
    if(id){
      // 删除抽样点
      handleDelete2(id);
    }
  }
}
//类型disasterArea,事件ID
const typeCode = ref("");
//根据事件ID查询灾区范围列表
function getSeismicInfluenceArray(geom){
  if (currentEvent.value) {
    let xsemId = currentEvent.value.id;
    //类型disasterArea,事件ID
    typeCode.value = "disasterArea,"+xsemId;
    getDisasterSeismicInfluenceList(xsemId,geom).then(response => {
      console.log("根据事件ID查询灾区范围列表");
      console.log(response.data);
      let list = response.data;
      if(geom){//新建|修改任务前查询空间范围是否在灾区范围内
        // if(list && list.length>0){
        //   if(list.length==1){//符合任务范围应在1个灾区范围烈度内
        //     let xstmId = taskDataForm.value.xstmId;
        //     if(xstmId){
        //       //修改任务
        //       handleEdit(xstmId);
        //     }else{
              //新建任务
              openTask();
        //     }
        //   }else{
        //     proxy.$modal.msgWarning("任务范围应在1个灾区范围烈度内，请修改任务区域");
        //   }
        // }else{
        //   proxy.$modal.msgWarning("任务范围应在1个灾区范围烈度内，请修改任务区域");
        // }
      }else{//初始化查询灾区范围
        shpDataForm.value.shpDataList = list;
        liduJiBieData.value = list
        if(list && list.length>0){
          let legendList = shpDataForm.value.shpLegendList;
          for(let i=0;i<legendList.length;i++){
            let val = legendList[i].value;
            for(let j=0;j<list.length;j++){
              if(val==list[j].intensity){//烈度
                legendList[i].show = true;//只显示灾区范围的烈度
                break;
              }
            }
          }
          shpDataForm.value.shpLegendList = legendList;
        }
      }
    });
  }else{
    shpDataForm.value.shpDataList = [];
  }
}
//根据事件ID、空间数据查询任务列表
function getSurTaskManageArray(geom){
  if (currentEvent.value && geom) {
    let xsemId = currentEvent.value.id;
    getSurTaskManageList(xsemId,geom).then(response => {
      console.log("根据事件ID、空间数据查询任务列表");
      console.log(response.data);
      let list = response.data;
      //新建|修改抽样点前查询抽样点是否在1个任务区域内
      if(list && list.length>0){
        if(list.length==1){//符合抽样点应在1个任务区域内
          let xstmId = list[0].xstmId;//任务ID
          sampleDataForm.value.xstmId = xstmId;//任务id
          let id = sampleDataForm.value.id;//抽样点ID
          if(id){
            //修改抽样点
            handleEdit2(id);
          }else{
            //新建抽样点
            openPoint();
          }
        }else{
          proxy.$modal.msgWarning("抽样点应在1个任务区域内，请修改抽样点");
        }
      }else{
        proxy.$modal.msgWarning("抽样点应在1个任务区域内，请修改抽样点");
      }
    });
  }
}
/*地图传参end*/

function showFastSiVersionDialog(){
  showFastSiVersionTableBool.value = true;
  // 根据事件ID查询地震影响场版本信息列表
  getFastSiVersionList();
}

// 根据事件ID查询地震影响场版本信息列表
function getFastSiVersionList(){
  let xsemId = currentEvent.value.id;
  if(xsemId){
    tableLoading.value = true;
    getFastSiVersionListByXsemId({xsemId,...queryParams3.value}).then(res=>{
      fastSiVersionList.value = res.data.rows ? res.data.rows : [];
      total3.value = res.data.total;
      tableLoading.value = false;
    })
  }
}

//选择快速影响场版本
const selectionData = ref({});
const selectRadio = ref('');

//单选选择
function getCurrentRow(row) {
  if (selectRadio.value) {
    if (selectRadio.value == row.fvId) {
      selectRadio.value = ''
      selectionData.value = {};// 取消勾选就把回传数据清除
      return;
    }
  }
  selectRadio.value = row.fvId;
  selectionData.value = row;
}

//确定选择快速影响场版本
const submitVersionSelect = ()=>{
  if (selectRadio.value) {
    showFastSiVersionTableBool.value = false;
    let fvId = selectRadio.value;
    // 根据版本ID查询地震影响场空间数据列表
    getFastSeismicInfluenceList(fvId);
    isCheckBox1.value = true;
  }else{
    fastSeismicInfluenceList.value = [];
    isCheckBox1.value = false;
    proxy.$modal.msgWarning("请选取版本");
  }
}

//快速影响场勾选事件
const checkBoxEvent1 = (val)=>{
  if(val){
    //确定选择快速影响场版本
    submitVersionSelect();
  }else{
    fastSeismicInfluenceList.value = [];
  }
}
const instrumentIntensityList = ref([])
//仪器烈度勾选事件
const checkBoxEvent2 = (val)=>{
  if(val){
    let xsemId = currentEvent.value.id;
    if(xsemId){
      let type = "0";//0:新建的评估子区   1:重新划定的评估子区
      //根据事件ID、类型查询抽样点房屋列表
      getInstrumentIntensityList({xsemId: xsemId}).then(res=>{
        instrumentIntensityList.value = res.data ? res.data : [];
      });
    }
  }else{
    instrumentIntensityList.value = [];
  }
}
//调查数据抽样点房屋数据列表
const samPoiHouDataList0 = ref([]);
//调查数据拟定烈度勾选事件
const checkBoxEvent3 = (val)=>{
  if(val){
    let xsemId = currentEvent.value.id;
    if(xsemId){
      let type = "";//0:新建的评估子区   1:重新划定的评估子区
      //根据事件ID、类型查询抽样点房屋列表
      getSamPoiHouDataByXsemIdAndType(xsemId,type).then(res=>{
        samPoiHouDataList0.value = res.data ? res.data : [];
      });
    }
  }else{
    samPoiHouDataList0.value = [];
  }
}
//补充调查数据抽样点房屋数据（补充调查的点）列表
const samPoiHouDataList1 = ref([]);
//补充调查数据拟定烈度勾选事件
const checkBoxEvent4 = (val)=>{
  if(val){
    let xsemId = currentEvent.value.id;
    if(xsemId){
      // let type = "";//0:新建的评估子区   1:重新划定的评估子区
      //根据事件ID、类型查询抽样点房屋列表
      getSamPoiHouDataByXsemIdAndType(xsemId).then(res=>{
        samPoiHouDataList1.value = res.data ? res.data : [];
      });
    }
  }else{
    samPoiHouDataList1.value = [];
  }
}
const option = ref([])
/** 获取字典值 */
async function getDictData() {
	await getDict("ldnd").then(response => {
	    option.value = response.data;
	});
}
//地震影响场空间数据列表
const fastSeismicInfluenceList = ref([]);
// 根据版本ID查询地震影响场空间数据列表
function getFastSeismicInfluenceList(fvId){
  getFastSeismicInfluenceListByFvId(fvId,"").then(res=>{
    let data = res.data;
    console.log(data);
    fastSeismicInfluenceList.value = data;
  })
}

//获取当前事件
watch(() => currentEvent.value, val => {
  if(val && val.id){
    console.log("获取当前事件");
    initFunction();//初始化
  }
},{ deep: true, immediate: true });

//初始化
function initFunction(){
  if(completeRefreshData.value){
    // getAllDataList();//获取全部任务列表
    // getAllDataList2();//获取全部抽样点列表
    // getList();//获取任务列表（分页）
    // getList2();//获取抽样点列表（分页）
    //根据事件ID查询灾区范围列表
    getSeismicInfluenceArray("");
  }
  getDictData()
}

onMounted(() => {
  completeRefreshData.value = true;
  initFunction();//初始化
})
</script>
  
<style scoped lang="scss">
.title {
    margin: 0 0 20px !important;
}

.mapDiv {
  position:absolute;top:0px;left:0px;width:100%;height:100%;
}

.currentEventDiv {
  position:absolute;top:20px;right:20px;background:rgba(255,255,255,0.8);border:1px solid gray;padding:10px;
}
.liduJiBie {
  position: absolute;
  top: 0px;
  left: 0px;
  background: #fff;
  box-shadow: 0px 0px 20px rgb(0 0 0 / 20%);
  border: 1px solid #707070;
  border-radius: 4px;
  padding: 5px;
  z-index: 10;
}
.new-legendDiv1 {
  position: absolute;
  bottom: 0px;
  right: 165px;
  background: #fff;
  box-shadow: 0px 0px 20px rgb(0 0 0 / 20%);
  border: 1px solid #707070;
  border-radius: 4px;
  padding: 5px;
  width: 84px;
}
.new-legendDiv1 div {
  position: relative;
  height: 16px;
  line-height: 16px;
  font-size: 13px;
  margin: 0 1px 0 1px;
}
/*灾区范围图层图例*/
.new-legendDiv {
  position: absolute;
  bottom: 0px;
  right: 0px;
  background: #fff;
  box-shadow: 0px 0px 20px rgb(0 0 0 / 20%);
  border: 1px solid #707070;
  border-radius: 4px;
  padding: 5px;
}
.new-legendDiv div {
  position: relative;
  height: 16px;
  line-height: 16px;
  font-size: 13px;
  margin: 8px;
}
.new-legendDiv div span {
  line-height: 16px;
  font-size: 13px;
}
.new-legendDiv div div {
  position: relative;
  top: 2px;
  left: 8px;
  width: 30px;
  height: 14px;
  margin: 0px !important;
  margin-right: 25px !important;
  display: inline-block;
}
.new-legendDiv-polygon {
  position: relative !important;
  left: 0px !important;
  top: 0px !important;
  border:1px solid black;
  background:#fff;
}
.new-legendDiv-point {
  position: relative !important;
  left: 10px !important;
  top: 0px !important;
  border-radius:5px;
  background:#fff;
  width: 10px !important;
  height: 10px !important;
}
.new-checkBoxDiv {
  p {
    height:30px;
  }
}
</style>
  
  